#home-index {
  font-family: PingFang-SC-Medium;
  .banner {
    margin-top: 1.26rem;
    width: 100%;
    height: 6.14rem;
    background-size: 100% 100%;
    background-image: url("../../assets/images/home/banner@2x.jpg");
    @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3) {
      background-image: url("../../assets/images/home/banner@3x.jpg");
    }
    font-size: 0.48rem;
    color: #FFFFFF;
    letter-spacing: 0;
    text-align: center;
    p:nth-of-type(1) {
      padding-top: 1.69rem;
    }
    div{
      width: 0.7rem;
      height: 0.04rem;
      background-color: white;
      margin-top: 0.14rem;
      margin-left: 3.4rem;
    }
  }
  .contect {
    width: 100%;
    height: 1.43rem;
    display: flex;
    flex-direction: row;
    div:nth-of-type(1) {
      text-align: center;
      width: 50%;
      background-color: #4A90E2;
      font-family: PingFangSC-Semibold;
      font-size: 0.36rem;
      color: #FFFFFF;
      p:nth-of-type(1) {
        margin-top: 0.19rem;
        font-family: PingFangSC-Semibold;
      }
      div{
        margin: 0.13rem 0 0 1.76rem;
        height: 0.02rem;
        width: 0.24rem;
        background-color: white;
      }
      a {
        font-family: PingFang-SC-Medium;
        margin: 0.05rem 0 0.18rem 0;
        text-decoration: none;
        color: #fff;
        display: block;
      }
      p:nth-of-type(2) {
        font-family: PingFang-SC-Medium;
        margin: 0.05rem 0 0.18rem 0;
      }
    }
    div:nth-of-type(2) {
      text-align: center;
      width: 50%;
      background-color: #2672CA;
      font-family: PingFangSC-Semibold;
      font-size: 0.36rem;
      color: #FFFFFF;
      p:nth-of-type(1) {
        margin-top: 0.19rem;
        font-family: PingFangSC-Semibold;
      }
      div{
        margin: 0.13rem 0 0 1.76rem;
        height: 0.02rem;
        width: 0.24rem;
        background-color: white;
      }
      p:nth-of-type(2) {
        font-family: PingFang-SC-Medium;
        margin: 0.05rem 0 0.18rem 0;
      }
    }
  }
  .intro {
    margin-top: 0.21rem;
    text-align: center;
    background-color: white;
    p:nth-of-type(1) {
      font-size: 0.48rem;
      color: #333;
    }
    p:nth-of-type(2) {
      font-size: 0.18rem;
      line-height: 0.25rem;
      margin-top: 0.1rem;
      color: #666;
    }
    div {
      width: 0.39rem;
      height: 0.04rem;
      margin:0.2rem 0 0 3.56rem;
      background-color: #666;
    }
    p:nth-of-type(3) {
      margin: 0.22rem 0.38rem 0 0.38rem;
      font-size: 0.28rem;
      color: #333;
      line-height: 0.41rem;
    }
    p:nth-of-type(4) {
      width: 2rem;
      height: 0.6rem;
      background-color: #2672CA;
      text-align: center;
      line-height: 0.6rem;
      margin: 0.21rem 0 0 2.76rem;
      font-size: 0.24rem;
      color: #fff;
    }
  }
  .welcome {
    width: 100%;
    background-color: #E7F2FF;
    margin-top: 0.36rem;
    p:nth-of-type(1) {
      font-size: 0.48rem;
      color: #333;
      text-align: center;
      padding-top: 0.24rem;
    }
    p:nth-of-type(2) {
      font-size: 0.18rem;
      margin-top: 0.1rem;
      color: #666;
      text-align: center;
    }
    .black {
      width: 0.4rem;
      height: 0.04rem;
      margin:0.2rem 0 0 3.56rem;
      background-color: #666;
    }
    .image {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      margin: 0.22rem 0.33rem 0 0.39rem;
      padding-bottom: 0.36rem;
      p {
        width: 100%;
        height: 0.5rem;
        background-color: #2672CA;
        font-size: 0.3rem;
        color: #FFFFFF;
        line-height: 0.5rem;
        text-align: center;
        padding: 0;
        // position: absolute;
        // bottom: 0
      }
      .intro-1{
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        margin-bottom: 0.17rem;
        height: 3.04rem;
        width: 3.26rem;
        background-size: 100% 100%;
        background-image: url("../../assets/images/home/intro-1@2x.jpg");
        @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3) {
          background-image: url("../../assets/images/home/intro-1@3x.jpg");
        }
      }
      .intro-2 {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        margin-bottom: 0.17rem;
        margin-left: 0.25rem;
        height: 3.04rem;
        width: 3.26rem;
        background-size: 100% 100%;
        background-image: url("../../assets/images/home/intro-2@2x.jpg");
        @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3) {
          background-image: url("../../assets/images/home/intro-2@3x.jpg");
        }
      }
    }

    .intro-3 {
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      margin-bottom: 0.17rem;
      height: 3.04rem;
      width: 3.26rem;
      background-size: 100% 100%;
      background-image: url("../../assets/images/home/intro-3@2x.jpg");
      @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3) {
        background-image: url("../../assets/images/home/intro-3@3x.jpg");
      }
    }
    .intro-4 {
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      margin-bottom: 0.17rem;
      margin-left: 0.25rem;
      height: 3.04rem;
      width: 3.26rem;
      background-size: 100% 100%;
      background-image: url("../../assets/images/home/intro-4@2x.jpg");
      @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3) {
        background-image: url("../../assets/images/home/intro-4@3x.jpg");
      }
    }

    .intro-5 {
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      margin-bottom: 0.17rem;
      height: 3.04rem;
      width: 3.26rem;
      background-size: 100% 100%;
      background-image: url("../../assets/images/home/intro-5@2x.jpg");
      @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3) {
        background-image: url("../../assets/images/home/intro-5@3x.jpg");
      }
    }
    .intro-6 {
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      margin-bottom: 0.17rem;
      margin-left: 0.25rem;
      height: 3.04rem;
      width: 3.26rem;
      background-size: 100% 100%;
      background-image: url("../../assets/images/home/intro-6@2x.jpg");
      @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3) {
        background-image: url("../../assets/images/home/intro-6@3x.jpg");
      }
    }
  }
  video {
    width: 100%;
    height: 4rem;
  }
  .recruit {
    width: 100%;
    height: 15.55rem;
    background-size: 100% 100%;
    background-image: url("../../assets/images/home/background@2x.jpg");
    @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3) {
      background-image: url("../../assets/images/home/background@3x.jpg");
    }
    .title {
      p:nth-of-type(1) {
        font-size: 0.48rem;
        color: #fff;
        text-align: center;
        padding-top: 0.26rem;
      }
      p:nth-of-type(2) {
        margin-top: 0.1rem;
        font-size: 0.18rem;
        color: #fff;
        text-align: center;
      }
      div {
        width: 0.4rem;
        height: 0.04rem;
        margin: 0.15rem 0 0 3.56rem;
        background-color: #fff;
      }
    }
    .images {
      margin: 0.22rem 0.34rem 0 0.4rem;
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;

      img {
        width: 3.26rem;
        height: 3.04rem;
      }
      .img {
        width: 3.26rem;
        margin-bottom: 0.17rem
      }
      div:nth-child(even) {
        margin-left: 0.24rem;
      }
      .top {
        height: 1.22rem;
        width: 3.26rem;
        background-color: #2672CA;
        margin-left: 0 !important;
        margin-top: -0.3rem;
        .name {
          font-family: PingFang-SC-Heavy;
          font-size: 0.3rem;
          padding-top: 0.24rem;
          color: #FFFFFF;
          text-align: center;
        }
        .job {
          font-size: 0.26rem;
          color: #fff;
          text-align: center;
        }
      }
      .bottom {
        width: 3.26rem;
        height: 2.1rem;
        background-color: #84B7F1;
        .describe {
          text-align: center;
          font-size: 0.26rem;
          color: #fff;
          padding: 0.22rem 0.35rem 0 0.35rem;
          overflow: hidden;
          text-overflow: ellipsis;
          display: -webkit-box;
          -webkit-line-clamp: 5;
          -webkit-box-orient: vertical;
        }
      }
    }
    .more {
      width: 2rem;
      height: 0.6rem;
      margin: 0 auto;
      margin-top: 0.18rem;
      background-color: #2672CA;
      font-size: 0.24rem;
      color: #fff;
      text-align: center;
      line-height: 0.6rem;
    }
  }
  .background-improve {
    margin-top: 0.36rem;
    text-align: center;
    p:nth-of-type(1) {
      font-size: 0.48rem;
      color: #333;
    }
    p:nth-of-type(2) {
      font-size: 0.18rem;
      line-height: 0.25rem;
      margin-top: 0.1rem;
      color: #666;
    }
    div {
      width: 0.39rem;
      height: 0.04rem;
      margin:0.29rem 0 0 3.56rem;
      background-color: #666;
    }
    p:nth-of-type(3) {
      margin: 0.22rem 0.38rem 0 0.38rem;
      font-size: 0.28rem;
      color: #333;
      line-height: 0.41rem;
    }
    p:nth-of-type(4) {
      width: 2rem;
      height: 0.6rem;
      background-color: #2672CA;
      text-align: center;
      line-height: 0.6rem;
      margin: 0.21rem 0 0 2.76rem;
      font-size: 0.24rem;
      color: #fff;
    }
  }
  .success-case {
    margin-top: 0.36rem;
    background-color: #E1EFFF;
    text-align: center;
    p:nth-of-type(1) {
      padding-top: 0.28rem;
      font-size: 0.48rem;
      color: #333;
    }
    p:nth-of-type(2) {
      font-size: 0.18rem;
      line-height: 0.25rem;
      margin-top: 0.1rem;
      color: #666;
    }
    .item {
      width: 0.39rem;
      height: 0.04rem;
      margin:0.2rem 0 0 3.56rem;
      background-color: #666;
    }
    .case-container {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      margin: 0.34rem 0.34rem 0 0.39rem;
      .case-item {
        img {
          width: 3.26rem;
          height: 2.18rem;
        }
        .item-desc {
          margin-top: -0.3rem;
          margin-bottom: 0.17rem;
          background-color: #2672CA;
          width: 3.26rem;
          height: 0.78rem;
          display: flex;
          flex-direction: row;
          align-items: center;
          div:nth-of-type(1) {
            font-size: 0.2rem;
            color: #fff;
            font-family: PingFang-SC-Heavy;
            span {
              margin-left: 0.16rem;
              font-size: 0.48rem;
            }
          }
          div:nth-of-type(2) {
            margin-left: 0.07rem;
            height: 0.52rem;
            width: 0.03rem;
            background-color: white;
          }
          div:nth-of-type(3) {
            display: flex;
            align-items: center;
            img {
              width: 0.54rem;
              height: 0.54rem;
              margin-left: 0.11rem;
            }
            span {
              color: #fff;
              margin-left: 0.1rem;
              font-size: 0.24rem;
              font-family: PingFang-SC-Heavy;
            }
          }
        }
      }
      .case-item:nth-child(even) {
        margin-left: 0.25rem;
      }

    }
    .more {
      margin: 0.24rem 0 0.36rem 2.57rem;
      width: 2rem;
      height: 0.6rem;
      background-color: #2672CA;
      text-align: center;
      line-height: 0.6rem;
      padding-top: 0 !important;
      font-size: 0.24rem !important;
      color: #FFF !important;
    }
  }
  .info-center {
    margin-top: 0.24rem;
    text-align: center;
    background-color: white;
    p:nth-of-type(1) {
      font-size: 0.48rem;
      color: #333;
    }
    p:nth-of-type(2) {
      font-size: 0.18rem;
      line-height: 0.25rem;
      margin-top: 0.1rem;
      color: #666;
    }
    .item {
      width: 0.39rem;
      height: 0.04rem;
      margin:0.2rem 0 0 3.56rem;
      background-color: #666;
    }
    .more {
      width: 2rem;
      height: 0.6rem;
      background-color: #2672CA;
      text-align: center;
      line-height: 0.6rem;
      margin: 0.34rem 0 0 2.76rem;
      font-size: 0.24rem;
      color: #fff;
    }
    // .border-line {
    //   margin-top: 0.25rem;
    //   margin-left: 0.41rem;
    //   width: 6.67rem;
    //   height: 1px;
    //   background-color: #e5e5e5;
    // }
    .info-container {
      padding-bottom: 0.25rem;
      border-bottom: 1px #e5e5e5 solid;
      margin: 0.36rem 0.41rem 0 0.39rem;
      display: flex;
      flex-direction: row;
      img {
        width: 2.9rem;
        height: 1.8rem;
      }
      div {
        margin-left: 0.22rem;
        display: flex;
        flex-direction: column;
        text-align: start;
        width: 3.58rem;
        p:nth-of-type(1) {
          height: 0.62rem;
          font-size: 0.28rem;
          color: #333;
          line-height: 0.31rem;
          overflow: hidden;
          text-overflow: ellipsis;
          display: -webkit-box;
          -webkit-line-clamp: 2;
          -webkit-box-orient: vertical;
        }
        p:nth-of-type(2) {
          margin-top: 0.11rem;
          font-size: 0.24rem;
          color: #666;
          line-height: 0.25rem;
          height: 0.73rem;
          overflow: hidden;
          text-overflow: ellipsis;
          display: -webkit-box;
          -webkit-line-clamp: 3;
          -webkit-box-orient: vertical;
        }
        p:nth-of-type(3) {
          margin-top: 0.08rem;
          font-size: 0.2rem;
          color: #C8C8C8;
        }
      }
    }
  }
  .secientific {
    margin-top: 0.36rem;
    text-align: center;
    background-color: #F4F4F4;
    p:nth-of-type(1) {
      padding-top: 0.25rem;
      font-size: 0.48rem;
      color: #333;
    }
    p:nth-of-type(2) {
      font-size: 0.18rem;
      line-height: 0.25rem;
      margin-top: 0.1rem;
      color: #666;
    }
    .item {
      width: 0.39rem;
      height: 0.04rem;
      margin:0.2rem 0 0 3.56rem;
      background-color: #666;
    }
    .imgs {
      margin: 0.46rem 0.5rem 0 0.5rem;
      padding-bottom: 0.55rem;
      img {
        width: 5.95rem;
        height: 2.11rem;
      }

      // display: flex;
      // flex-direction: row;
      // flex-wrap: wrap;
      // img {
      //   width: 0.6rem;
      //   height: 0.55rem;
      //   margin-bottom: 0.17rem;
      // }
      .left {
        margin-left: 1.2rem;
      }
    }
  }
}
